			       <script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
  $("#accordion h3:first").addClass("active");
  $("#accordion div:not(:first)").hide();
  $("#accordion h3").click(function(){
    $(this).next("div").slideToggle("slow")
    .siblings("div:visible").slideUp("slow");
    $(this).toggleClass("active");
    $(this).siblings("h3").removeClass("active");
  });

/* IDEM PERO EL PRIMERO DESPLEGADO
  $("#acordeon h2:first").addClass("active");
  $("#acordeon div:not(:first)").hide();
  $("#acordeon h2").click(function(){
    $(this).next("div").slideToggle("slow")
    .siblings("div:visible").slideUp("slow");
    $(this).toggleClass("active");
    $(this).siblings("h2").removeClass("active");
  });
*/

});
//]]>
</script>
<style>
  #accordion { /* el rectángulo contenedor */
	margin-top: 520px;
	margin-left: 10px;
	width: 822px;
  }
  #accordion h3 { /* los enlaces que despliegan y contraen el contenido */
    -moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0 0 6px #444 inset;
	-webkit-box-shadow: 0 0 6px #444 inset;
	box-shadow: 0 0 6px #444 inset;
	background-color: #AFADAD;
	color: #3D3D3D;
	cursor: pointer;
	font-family: Tahoma;
	font-size: 17px;
	font-weight: normal;
	line-height: 1.7em;
	margin: 0 0 2px;
	position: relative;
	padding: 5px;
  }
  #accordion h3 p{
  	font-size: 18px;
left: 5px;
position: relative;
margin: 13px 49px;
  }
  #accordion h3:hover { /* efecto hover sobre esos enlaces */
    -moz-box-shadow: 0 0 10px #000 inset;
    -webkit-box-shadow: 0 0 10px #000 inset;
    box-shadow: 0 0 10px #000 inset;
    background-color: #BF1919;
    color: #FFF;
  }
  #accordion h3 span { /* una imagen que permuta segñun el estado del contenido */
    background: transparent url(http://img810.imageshack.us/img810/6159/demoacordeonjs.gif) no-repeat right top;
    display: block;
    height: 16px;
    position: absolute;
    right: 20px;
    top: 7px;
    width: 16px;
  }
  #accordion h3.active span { /* desplegado */
    background-position: right bottom;
  }
  #accordion div { /* el contenido */
	border: 1px dotted rgba(255, 255, 255, 0);
	color: #000;
	font-family: Georgia;
	font-size: 13px;
	line-height: 1.5;
	margin: 5px;
	padding: 10px;
	border-width: 1px;
	border-color: black;
	border-radius: 4px;
	border-style: solid;
  }
</style>
<div id="header" class="sede">
		<p><?php echo '<i class="titulo-rojo">Sede</i> '.$sede_seleccionada->nombre;?></p>
		<a href="<?php echo base_url();?>" title="Volver al inicio"><img id="logo" src="<?php echo base_url();?>recursos/imagenes/logo.png"></a>	
	</div>
	<div id="contenidos">
		<div id="clear"></div>
		<div id="nav">
			<div id="titulo-nav">
				<p>Sedes</p>
				<p>Universitarias</p>
			</div>
			<div id="universidades-nav">
				<?php
					foreach ($sedes as $sede) {	
						if ($sede->id_sede == $sede_seleccionada->id_sede) {
				?>
							<p><a id="selected" href="<?php echo base_url().'welcome/sede/'.$sede->id_sede; ?>"><?php echo $sede->nombre;?></a></p>								
							<ul id="localidades" >
							<?php
								foreach ($subsedes as $sub) {
									if((isset($id_sub)) && ($sub->id_subsede == $id_sub)) {
									$nombre_sub = $sub->localidad.' <i id="icono" class="entypo-right-open"></i>';	
							?>
							<li><a id="selected" href="<?php echo base_url().'welcome/sub/'.$sub->id_subsede ?>"><?php echo $sub->localidad; ?></a></li>
							<?php
								}else{
						?>	
									<li><a href="<?php echo base_url().'welcome/sub/'.$sub->id_subsede; ?>"><?php echo $sub->localidad; ?></a></li>				
						<?php
								}}
						?>							
							</ul>
						<?php										
						}else{
						?>
							<p><a id="univ" href="<?php echo base_url().'welcome/sede/'.$sede->id_sede; ?>"><?php echo $sede->nombre;?></a></p>								
				<?php		
						}							
					}
				?>
				<!--
				<p id="univ" >Sede Andina</p>
				<ul id="localidades" >
					<li><a href="#">Bariloche</a></li>
					<li><a href="#">El Bolson</a></li>
				</ul>
				!-->
			</div>
		</div>
		<div id="content">
			<div id="clear"></div>
			<div id="menu-content">
				<ul>
					<li><a href="<?php echo base_url()."calendario/examenesSede/".$sede_seleccionada->id_sede;?>">Mesas de examenes</a></li>
					<li><a href="<?php echo base_url()."welcome/avisos/".$sede_seleccionada->id_sede;?>">Avisos</a></li>
					<li><a id="seleccionado" href="<?php echo base_url()."welcome/pdi/".$sede_seleccionada->id_sede;?>">Puntos de interes</a></li>
					<li class="final-list"><a  href="<?php echo base_url()."welcome/actividades/".$sede_seleccionada->id_sede;?>">Eventos academicos</a></li>
				</ul>
			</div>
			
			<div id="actividades">
				<p id="titulo-actividades"><a id="link-atras" title="Volver" href="<?php echo base_url().'welcome/sede/'.$sede->id_sede;?>">Sede <?php echo $sede_seleccionada->nombre;?></a> <i id="icono" class="entypo-right-open"></i><?php echo ' '.$nombre_sub;?> Puntos de Interes</p>
			</div>		
			
		<div id="mapa">
				
			<script type="text/javascript">
			function datos_marker(lat, lng, marker)
   			{
     		var mi_marker = new google.maps.LatLng(lat, lng);
    		 map.panTo(mi_marker);
     		google.maps.event.trigger(marker, 'click');
    		}
			</script>
				<?=$map['js']?>
				<?=$map['html']?>
				<?php if(!isset($id_sub)){ ?>
			<div id="sidebarmap-pdi">
				<ul style="margin-left: -39px;text-align: center;"><h4 style="border-bottom-style: solid;border-bottom-color: #959595;border-bottom-width: 2px;color: #777777;">Puntos de Interes </h4>
				</br>
				<?php
				foreach($datos as $marker_sidebar)
					{
						
				if((isset($id_sub))&&($marker_sidebar->id_sede==$id_sede)&&($marker_sidebar->id_subsede==$id_sub)){ 

				?><li id="selec" onclick="datos_marker(<?=$marker_sidebar->latitud?>,<?=$marker_sidebar->longitud?>,marker_<?=$marker_sidebar->id_pdi?>)">
				<a  class="entypo-tag" href=""></a>&nbsp;&nbsp;<?=substr($marker_sidebar->nombre,0,100)?></li><?php
					// }
				}else{if(($marker_sidebar->id_sede==$id_sede)&&(!isset($id_sub))){ 

				?><li id="selec" onclick="datos_marker(<?=$marker_sidebar->latitud?>,<?=$marker_sidebar->longitud?>,marker_<?=$marker_sidebar->id_pdi?>)">
				<a  class="entypo-tag" href=""></a>&nbsp;&nbsp;<?=substr($marker_sidebar->nombre,0,100)?></li><?php
					// }
				} }}
				?>
				
				</ul>
			</div>
			<?php }
				?>
			</div>	
			
				<div id="accordion">

      <?php 
   
      foreach($datos as $pd) {
              if(isset($id_sub)&&($pd->id_subsede==$id_sub)){ ?>

          <h3> <img class="imagen" src="<?php echo base_url().$pd->imagen; ?>"style="float:left;width: 50px;height: 50px;"onclick="datos_marker(<?=$pd->latitud?>,<?=$pd->longitud?>,marker_<?=$pd->id_pdi?>)"> </img> <p><?php echo $pd->nombre; ?></p></h3>

                <div>  
                Localizacion:  <?php echo $pd->calle; ?> <?php echo $pd->numero; ?>, <?php echo $pd->ciudad; ?>, <?php echo $pd->provincia; ?>, <?php echo $pd->pais; ?>.
                 </br>
                 <?php echo $pd->descripcion; ?>
                  </div> 
                                      
                     
         
       <?php }
               } ?>
</div>
					
		</div>
		<div id="clear"></div>
	</div>	
	<div id="footer">
		<p>Sistema de puntos de interes universitario<br>
			Desarrollado por G.Cayu-G.Difabio-L.López / UNRN / 2014</p>
	</div>
</div>


</body>	
</html>